import 'package:flutter/material.dart';
import 'package:wayofdressing/contraints.dart';
import 'package:wayofdressing/components/inmenubutton.dart';
import 'package:wayofdressing/components/choosebutton.dart';

class MarketScreen extends StatefulWidget {
  static String id = 'marketscreen';

  @override
  State<MarketScreen> createState() => _MarketScreenState();
}

class _MarketScreenState extends State<MarketScreen> {
  List<Widget> widgetList2 = [];

  List<Widget> tops = [];

  int whoisactive1 = 1;
  int whoisactive2 = 1;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xfffffaf0),
      appBar: AppBar(
        backgroundColor: Color(0xfffffaf0),
        elevation: 0,
        toolbarHeight: 80,
        leadingWidth: 100,
        centerTitle: true,
        title: Text(
          '市集',
          style: TextStyle(
            color: Colors.black,
            fontWeight: FontWeight.bold,
            fontSize: kTopTitleFontSize,
          ),
        ),
        leading: Row(
          children: [
            SizedBox(
              width: 10,
            ),
            GestureDetector(
              onTap: () {
                Navigator.pop(context);
              },
              child: Transform.scale(
                scaleX: -1,
                child: Icon(
                  Icons.play_arrow_rounded,
                  size: kAppBarButtonSize,
                  color: Colors.black.withOpacity(0.5),
                ),
              ),
            ),
          ],
        ),
        actions: [
          MenuAnchor(
            menuChildren: [
              InMenuButton(
                onPressed: () {},
                text: '待开发',
                alignment: Alignment.centerRight,
              ),
            ],
            style: MenuStyle(
              shape: MaterialStateProperty.all(
                RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(25.0),
                ),
              ),
              alignment: Alignment(-3, 0.5),
              padding: MaterialStateProperty.all(EdgeInsets.all(15.0)),
              shadowColor: MaterialStateProperty.all(Colors.transparent),
              backgroundColor: MaterialStateProperty.all(
                Colors.black.withOpacity(0.4),
              ),
            ),
            builder: (BuildContext context, MenuController controller,
                Widget? child) {
              return GestureDetector(
                onTap: () {
                  if (controller.isOpen) {
                    controller.close();
                  } else {
                    controller.open();
                  }
                },
                child: Icon(
                  Icons.keyboard_control_rounded,
                  size: kAppBarButtonSize,
                  color: Colors.black,
                ),
              );
            },
          ),
          SizedBox(
            width: 20,
          )
        ],
      ),
      body: Column(
        children: [
          Container(
            height: 38,
            margin: EdgeInsets.symmetric(horizontal: 80,vertical: 5),
            decoration: BoxDecoration(
              boxShadow: [
                BoxShadow(
                  color: Colors.black.withOpacity(0.2),
                  // 阴影颜色和透明度
                  spreadRadius: 2,
                  // 阴影扩展半径
                  blurRadius: 5,
                  // 阴影模糊半径
                  offset: Offset(0, 2), // 阴影偏移量
                ),
              ],
              borderRadius: BorderRadius.circular(25),
              color: Colors.white,
            ),
            child: ListView(
              scrollDirection: Axis.horizontal,
              children: [
                SizedBox(
                  width: 10,
                ),
                chooseButton(
                  isActive: whoisactive1,
                  text: '分类',
                  listNumber: 1,
                  onPressed: () {
                    setState(() {
                      whoisactive1 = 1;
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive1,
                  text: '风格',
                  listNumber: 2,
                  onPressed: () {
                    setState(() {
                      whoisactive1 = 2;
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive1,
                  text: '店铺',
                  listNumber: 3,
                  onPressed: () {
                    setState(() {
                      whoisactive1 = 3;
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive1,
                  text: '我的',
                  listNumber: 4,
                  onPressed: () {
                    setState(() {
                      whoisactive1 = 4;
                    });
                  },
                ),
                SizedBox(
                  width: 10,
                ),
              ],
            ),
          ),
          if (whoisactive1 == 1) Container(
            height: 36,
            margin: EdgeInsets.symmetric(horizontal: 30, vertical: 5),
            decoration: BoxDecoration(
              boxShadow: [
                BoxShadow(
                  color: Colors.black.withOpacity(0.2),
                  // 阴影颜色和透明度
                  spreadRadius: 2,
                  // 阴影扩展半径
                  blurRadius: 5,
                  // 阴影模糊半径
                  offset: Offset(0, 2), // 阴影偏移量
                ),
              ],
              borderRadius: BorderRadius.circular(25),
              color: Colors.white,
            ),
            child: ListView(
              scrollDirection: Axis.horizontal,
              children: [
                SizedBox(
                  width: 10,
                ),
                chooseButton(
                  isActive: whoisactive2,
                  text: '全部',
                  listNumber: 1,
                  onPressed: () {
                    setState(() {
                      whoisactive2 = 1;
                      widgetList2 = [];
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive2,
                  text: '帽子',
                  listNumber: 2,
                  onPressed: () {
                    setState(() {
                      whoisactive2 = 2;
                      widgetList2 = [];
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive2,
                  text: '上衣',
                  listNumber: 3,
                  onPressed: () {
                    setState(() {
                      whoisactive2 = 3;
                      widgetList2 = tops;
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive2,
                  text: '鞋子',
                  listNumber: 4,
                  onPressed: () {
                    setState(() {
                      whoisactive2 = 4;
                      widgetList2 = [];
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive2,
                  text: '袜子',
                  listNumber: 5,
                  onPressed: () {
                    setState(() {
                      whoisactive2 = 5;
                      widgetList2 = [];
                    });
                  },
                ),
                chooseButton(
                  isActive: whoisactive2,
                  text: '饰品',
                  listNumber: 6,
                  onPressed: () {
                    setState(() {
                      whoisactive2 = 6;
                      widgetList2 = [];
                    });
                  },
                ),
                SizedBox(
                  width: 10,
                ),
              ],
            ),
          ),
          if (whoisactive1 == 2) Container(),
          if (whoisactive1 == 3) Container(),
          if (whoisactive1 == 4) Container(),
        ],
      ),
    );
  }
}
